<template>
    <div>
        <!-- 修改诊断信息 -->
        <h2>诊断管理</h2>
        <div class="head">
            <el-button @click="back" size="mini" type="info" class="el-icon-back">
                返回
            </el-button>
            <el-button @click="toItem" size="mini" type="success" class="el-icon-plus">
                药品
            </el-button>
        </div>
        <el-form :label-position="labelPosition" label-width="80px" :model="form"
            style="text-align: left;margin-left: 10px;padding-bottom: 10px;">
            <el-form-item label="类型" style="font-weight: bolder;display: inline-block;width: 600px;margin-right: 30px;">
                <el-select v-model="form.type" placeholder="请选择类型(必填)" style="width: 600px;">
                    <el-option label="门诊" value="0"></el-option>
                    <el-option label="住院" value="1"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="状态" style="font-weight: bolder;display: inline-block;width: 600px;">
                <el-select v-model="form.status" placeholder="请选择状态(必填)" style="width: 600px;">
                    <el-option label="新开单" value="0"></el-option>
                    <el-option label="进行中" value="1"></el-option>
                    <el-option label="已完成" value="2"></el-option>
                    <el-option label="已暂停" value="3"></el-option>
                    <el-option label="已取消" value="4"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="编号" style="font-weight: bolder;display: inline-block;width: 600px;margin-right: 30px;">
                <el-input v-model="form.clinicNumber" placeholder="请填写编号(必填)"></el-input>
            </el-form-item>
            <el-form-item label="标题" style="font-weight: bolder;display: inline-block;width: 600px;">
                <el-input v-model="form.title" placeholder="请填写标题(必填)"></el-input>
            </el-form-item>
            <el-form-item label="诊断" style="font-weight: bolder;display: inline-block;width: 600px;margin-right: 30px;">
                <el-input type="textarea" :rows="9" v-model="form.diagnosisText" placeholder="请填写诊断信息(必填)"></el-input>
            </el-form-item>
            <el-form-item label="患者" style="font-weight: bolder;display: inline-block;width: 600px;">
                <el-input placeholder="查找...(必填)" readonly v-model="form.patient" disabled>
                    <el-button @click="searchPatient" type="success" slot="suffix" size='mini'>
                        <i class="el-icon-search">查找</i>
                    </el-button>
                </el-input>
            </el-form-item>

            <hr style="margin: 10px 10px;border: 1px solid black;">

            <el-form-item label="会诊科室" style="font-weight: bolder;display: inline-block;width: 600px;margin-right: 30px;">
                <el-select v-model="form.depName" placeholder="请选择科室(必填)" style="width: 600px;">
                    <el-option v-for="item in opData" :label="item.depName" :value="item.depId"></el-option>

                </el-select>
            </el-form-item>
            <el-form-item label="住院床号" style="font-weight: bolder;display: inline-block;width: 600px;">
                <el-input v-model="form.bedNumber"></el-input>
            </el-form-item>
            <el-form-item label="挂号费" style="font-weight: bolder;display: inline-block;width: 600px;margin-right: 30px;">
                <el-input v-model="form.registrationFees"></el-input>
            </el-form-item>
            <el-form-item label="附加费" style="font-weight: bolder;display: inline-block;width: 600px;">
                <el-input v-model="form.additionalFees"></el-input>
            </el-form-item>
            <el-form-item label="付款日期"
                style="font-weight: bolder;display: inline-block;width: 600px;margin-right: 30px;margin-top: -50px;">
                <el-date-picker type="datetime" placeholder="选择日期时间(必填)" v-model="form.createTime"
                    :picker-options="pickerOptions" style="width: 100%;"></el-date-picker>
            </el-form-item>
            <el-form-item label="是否付款" style="font-weight: bolder;display: inline-block;width: 600px;">
                <input type="checkbox" v-model="form.isPaid" @click="my_isPaid" style="width: 20px;height: 20px;">
            </el-form-item>
            <el-form-item>
                <el-button @click="alterDiagnosis" type="primary">保存</el-button>
                <el-button @click="back">取消</el-button>
            </el-form-item>

        </el-form>
        <el-dialog width="60%" title="" :visible.sync="dialogTableVisible">
            <div class="head2">
                <div class="my_btn">
                    <h2>查找患者</h2>
                    <el-button @click="deletePatient" size="mini" type="danger" class="el-icon-brush">
                        擦除
                    </el-button>
                </div>
                <div class="search">
                    <el-input placeholder="查找..." v-model="searchContent" class="input-with-select">
                        <el-button @click="my_search" slot="append" icon="el-icon-search"></el-button>
                    </el-input>
                </div>
            </div>
            <el-table :data="patientData">
                <el-table-column property="type" label="类型" width="auto">
                    <template slot-scope="scope">
                        <el-tag disable-transitions v-if="scope.row.type == 0">
                            私海
                        </el-tag>
                        <el-tag disable-transitions v-if="scope.row.type == 1">
                            公海
                        </el-tag>
                    </template>
                </el-table-column>
                <el-table-column property="name" label="患者姓名" width="auto"></el-table-column>
                <el-table-column property="sex" label="性别" width="auto">
                    <template slot-scope="scope">
                        <el-tag disable-transitions v-if="scope.row.type == 0">
                            女
                        </el-tag>
                        <el-tag disable-transitions v-if="scope.row.type == 1">
                            男
                        </el-tag>
                    </template>
                </el-table-column>
                <el-table-column property="age" label="年龄" width="auto"></el-table-column>
                <el-table-column property="phone" label="手机号码" width="auto"></el-table-column>
                <el-table-column property="IdCard" label="身份证号" width="auto"></el-table-column>
                <el-table-column property="contact" label="负责人" width="auto"></el-table-column>
                <el-table-column property="status" label="状态" width="auto">
                    <template slot-scope="scope">
                        <el-tag disable-transitions type="success" v-if="scope.row.status == 0">
                            有效
                        </el-tag>
                        <el-tag disable-transitions type="info" v-if="scope.row.status == 1">
                            无效
                        </el-tag>
                    </template>
                </el-table-column>
                <el-table-column fixed="right" label="操作" align="center" width="180">
                    <template slot-scope="scope">
                        <el-button type="primary" size="mini" class="el-icon-plus" @click="selectPatient(scope.row)">
                            选择该患者
                        </el-button>
                    </template>
                </el-table-column>
            </el-table>
            <Pagination @getPagination="getPagination" :total="total" :pageSize="pageSize"></Pagination>

        </el-dialog>
    </div>
</template>

<script>
import Pagination from '@/components/Pagination'
export default {
    name: 'Edit2',
    components: {
        Pagination,
    },
    data() {
        return {
            opData:[],
            labelPosition: 'top',
            pageSize:5,
            total:0,
            patientName: '',
            searchContent:'',
            form: {
                "id":'',
                "type": '',//类型
                "status": '',//状态
                "clinicNumber": "",//编号
                "title": "",//标题
                "diagnosisText": "",//诊断信息--真
                "details":'',//详情
                "patientId": '',//患者id
                "patient":"",//患者姓名
                "depId": '',//会诊科室编号
                "depName": '',//会诊科室名称
                "bedNumber": "",//住院床号
                "registrationFees": '',//挂号费
                "additionalFees": '',//附加费
                "createTime": "",//创建时间付款日期----真
                "isPaid": 0,//是否付款
            },
            patientData: [//患者信息
                {
                    id:'',
                    type: '',//类型0私海1公海
                    name: '',//患者名称
                    sex: '',//性别0女1男
                    age: '',//年龄
                    phone: '',//手机号码
                    IdCard: '',//身份证号
                    contact: '',//负责人
                    status: '',//状态0有效1无效
                },
            ],
            pickerOptions: {
                shortcuts: [{
                    text: '今天',
                    onClick(picker) {
                        picker.$emit('pick', new Date());
                    }
                }, {
                    text: '昨天',
                    onClick(picker) {
                        const date = new Date();
                        date.setTime(date.getTime() - 3600 * 1000 * 24);
                        picker.$emit('pick', date);
                    }
                }, {
                    text: '一周前',
                    onClick(picker) {
                        const date = new Date();
                        date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
                        picker.$emit('pick', date);
                    }
                }]
            },
            dialogTableVisible: false,
            
        }
    },
    created(){
        this.$axios({
            method: 'get',
            url: '/diagnosis/diagnosisManagement/findDiagnosisById',
            params: {
                id:this.$route.query.id
            },
        })
        .then(resp => {
            console.log(this.$route.query.id);
            console.log(resp.data.data);
            this.form=resp.data.data;
            
        })
    },
    methods: {
        back() {//返回到诊断管理
            this.$router.push('diaManage')
        },
        toItem() {//新增药品，跳转到开药单
            this.$router.push({path:'/Diagnosis/Item',query:{patient:this.form.patient,id:this.$route.query.id}})
        },
        my_isPaid() {
            if (this.form.isPaid == 0) {
                this.form.isPaid = 1 ;
                
            } else {
                this.form.isPaid = 0
            }
            // console.log('isPaid1',this.form.isPaid);
        },
        my_search(){//查询患者
            if(this.searchContent==''){
                this.$axios({
                    method: 'get',
                    url: '/Patient/management/findPatientList',
                    params: {
                        currentPage:1,
                        pageSize:5,
                    }
                })
                .then(resp => {
                    console.log(resp.data.data.list);
                    this.total=parseInt(resp.data.data.total);
                    this.patientData=resp.data.data.list;
                })
            }else{
                this.$axios({
                    method: 'post',
                    url: `/Patient/management/findPatientByName?currentPage=1&name=${this.searchContent}&pageSize=5`,
                    data: {
                        name:this.searchContent,
                        currentPage:1,
                        pageSize:5,
                    }
                })
                .then(resp => {
                    console.log(resp.data.data.list);
                    this.total=parseInt(resp.data.data.total);
                    this.patientData=resp.data.data.list;
                })
            }
        },
        searchPatient() {//点击查询患者,弹出对话框
            this.$axios({
                method: 'get',
                url: '/Patient/management/findPatientList',
                params: {
                    currentPage:1,
                    pageSize:5,
                }
            })
            .then(resp => {
                console.log(resp.data.data.list);
                this.total=parseInt(resp.data.data.total);
                this.patientData=resp.data.data.list;
                this.dialogTableVisible = true;
            })
        },
        deletePatient() {//擦除
            this.patientName = '';
            this.form.patientId = '';
            this.dialogTableVisible = false;
        },
        selectPatient(row) {//选择该患者
            console.log(row);
            if(row.status==0){
                this.form.patient = row.name;
                this.form.patientId = row.id;
                this.dialogTableVisible = false;
            }else{
                this.$message({
                    message:'该患者状态无效，请重新选择',
                    type:'warning'
                })
            }
        },
        alterDiagnosis() {//保存修改诊断信息
            // console.log('isPaid2',this.form.isPaid);
            // console.log('isPaid3',Number(this.form.isPaid));
            this.form.isPaid=Number(this.form.isPaid);
            // console.log('isPaid4',this.form.isPaid);
            if(this.form.clinicNumber !='' && this.form.title !='' && this.form.diagnosisText !='' && this.form.patientId !='' && this.form.depId !='' && this.form.createTime !=''){
                this.$axios({
                    method: 'post',
                    url: '/diagnosis/diagnosisManagement/updateDiagnosis',
                    data: this.form,
                })
                .then(resp => {
                    console.log(resp.data);
                    this.$router.push('diaManage')
                })
            }else{
                this.$message({
                    message:'新增失败，必填项不能为空！',
                    type:'warning'
                })
            }
            
        },
        getPagination(page) {//分页器
            this.$axios({
                method: 'get',
                url: '/Patient/management/findPatientList',
                params: {
                    currentPage:page,
                    pageSize:5,
                }
            })
            .then(resp => {
                console.log(resp.data.data.list);
                this.patientData=resp.data.data.list;
                
            })

        },
    },
    beforeMount(){
        this.$axios({
            method: 'get',
            url: '/userManagement/deptManagement/findDeptList1',
            params: {
            }
        })
        .then(resp => {
            this.opData=resp.data.data; 
        })
       
    },
}
</script>

<style lang="less" scoped>
h2 {
    text-align: left;
    margin: 10px;
}

.head {
    display: flex;
    margin: 5px;
    padding: 10px;
    height: 30px;
    border-top: 5px solid gainsboro;
    border-radius: 5px;
    background-color: white;
}

.head2 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 5px;
    padding: 10px;
    height: 30px;
    border-top: 5px solid gainsboro;
    border-radius: 5px;
    background-color: white;
}

.my_btn {
    float: left;
    display: flex;
    align-items: center;
}

.search {
    float: right;
}

.my_search {
    padding: 5px;
}</style>